<template>
    <rx-layout>
        <template v-slot:center>
            <div class="Transfer-center">
                <div style="margin-bottom: 0.5rem">
                    <div style="margin-bottom: 0.25rem" class="bpm-REQUIRED">{{ i18n('rejectMode', '驳回方式') }}:</div>
                    <span v-for="radioItem in backs" @change="changeCheckType">
                        <radio :checked="radioItem.value == checkType"
                               @click.stop="changeCheckType(radioItem.value)"/>
                        <span style="margin-right: 1rem">{{ radioItem.label }}</span>
                    </span>
                </div>
                <div style="margin-bottom: 0.5rem" v-if="checkType=='BACK_TO_STARTOR' && !bpmTaskDetail.isBatch && bpmTaskDetail.taskConfig.startReturnMode=='both'">
                    <div style="margin-bottom: 0.25rem">{{ i18n('backTaskComplete', '回退任务完成后') }}:</div>
                    <span v-for="radioItem in nextJumpTypeList" @change="changeCheckType">
                        <radio :checked="radioItem.value == nextJumpType"
                               @click.stop="nextJumpType=radioItem.value"/>
                        <span style="margin-right: 1rem">{{ radioItem.label }}</span>
                    </span>
                </div>
                <div style="margin-bottom: 0.5rem" v-if="checkType=='BACK_SPEC'">
                    <div style="margin-bottom: 0.25rem" class="bpm-REQUIRED">{{ i18n('specifyNodes', '指定节点') }}:</div>
                    <next-data-select
                        v-if="showNode"
                        :multiple="false"
                        v-model="destNodeId"
                        @change="changeNodeIdCheckType"
                        :options="backNodes"
                        :disabled="false"
                        :placeholder="i18n('specifyNode','请指定节点')"
                        optionsLabelKey="label"
                        optionsValueKey="value"
                    />
                </div>
                <div style="margin-bottom: 0.5rem" v-if="checkType=='BACK_SPEC' && !bpmTaskDetail.isBatch && bpmTaskDetail.taskConfig.specReturnMode=='both'">
                    <div style="margin-bottom: 0.25rem">{{ i18n('backTaskComplete', '回退任务完成后') }}:</div>
                    <span v-for="radioItem in nextJumpTypeList" @change="changeCheckType">
                        <radio :checked="radioItem.value == nextJumpType"
                               @click.stop="nextJumpType=radioItem.value"/>
                        <span style="margin-right: 1rem">{{ radioItem.label }}</span>
                    </span>
                </div>
                <div style="margin-bottom: 0.5rem">
                    <div style="margin-bottom: 0.25rem" class="bpm-REQUIRED">{{ i18n('remark', '意见') }}:</div>
                    <textarea class="Transfer-textarea" v-model="opinion" :placeholder="i18n('remark','意见','input')" />
                </div>
                <div style="margin-bottom: 0.5rem">
                    <div style="margin-bottom: 0.25rem">{{ i18n('attachment', '附件') }}:</div>
<!--                    <Accessory @handOk="handOk" :fileL="fileList"></Accessory>-->
                </div>
                <div style="margin-bottom: 0.5rem">
                    <div>{{ i18n('cc', '抄送') }}:</div>
                    <RxVueUserDialog style="margin-top: 15px" v-model="copyUsers" :organization="true"></RxVueUserDialog>
                </div>
            </div>
        </template>
        <template v-slot:footer>
            <div class="bpm-footer">
                <div @click="closeWindow" class="bpm-footer-close">{{ $ti18('rxForm.cancelBtn', '取消') }}</div>
                <div @click="handleCompleteCheck" class="bpm-footer-ok">{{ $ti18('rxForm.okBtn', '确定') }}</div>
            </div>
        </template>
    </rx-layout>
</template>

<script>
import RxLayout from '@/components/RxLayout'
import RxVueUserDialog from '@/components/RxVueUserDialog';
import BpmtaskApi from '@/api/rxBpm/bpmTask'

export default {
    name: "BpmTaskBack",
    data() {
        return {
            checkType: 'BACK',

            backConfig:[
                {label:this.i18n('stepBack','驳回上一步'), value: 'BACK'},
                {label:this.i18n('backToStartor','驳回到发起人'), value: 'BACK_TO_STARTOR'},
                {label:this.i18n('backSpec','驳回到审批节点'), value: 'BACK_SPEC'}
            ],
            //驳回选择
            backs: [],

            nextJumpTypeList: [{
                label: this.i18n('normal', '正常执行'),
                value: 'normal'
            },
                {
                    label: this.i18n('backtrack', '原路返回'),
                    value: 'source'
                },
            ],
            fileList: [],
            nextJumpType: 'normal',
            taskId: '',
            instId:'',
            opinion: '',
            copyUsers: [],//抄送
            showUser: false,
            ccsingle: false,

            backNodes: [],
            destNodeId: '',
            showNode:false
        }
    },
    components: {
        RxLayout,
        RxVueUserDialog
    },
    onLoad(option) {
        let bpmTaskDetailStr = uni.getStorageSync('bpmTaskDetail');
        this.bpmTaskDetail = JSON.parse(bpmTaskDetailStr);
        this.instId = this.bpmTaskDetail.bpmInst.instId;
        this.taskId = this.bpmTaskDetail.bpmTask.taskId;
        this.init();
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "bpmLang", key);
        },
        init() {
            //驳回选项。
            this.handBackOptions();
            //加载驳回节点
            this.loadBackNodes();
        },
        changeNodeIdCheckType(val){
            this.loadBackNodes();
        },
        changeCheckType(val){
            this.checkType = val;
            this.loadBackNodes();
        },
        /**
         * 加载可以驳回的节点。
         */
        loadBackNodes(){
            let self_=this;
            let bpm = this.bpmTaskDetail;
            let startReturnMode=bpm.taskConfig.startReturnMode  || "both";
            let specReturnMode=bpm.taskConfig.specReturnMode || "both";
            if(self_.checkType=="BACK_TO_STARTOR"){
                if(startReturnMode && startReturnMode!='both'){
                    this.nextJumpType=startReturnMode;
                }
            }
            if(self_.checkType=="BACK_SPEC"){
                if(specReturnMode && specReturnMode!='both'){
                    this.nextJumpType=specReturnMode;
                }
            }
            self_.showNode=false;
            if(self_.checkType!="BACK_SPEC"){
                return;
            }
            if(self_.backNodes.length>0){
                self_.showNode=true;
                return;
            }
            BpmtaskApi.getBackNodes(this.taskId).then(res=>{
                self_.backNodes=res.map(item=>{
                    return {label:item.nodeName,value:item.nodeId,multipleType:item.multipleType};
                })
                self_.showNode=true;
            });
        },
        /**
         * 处理驳回的处理。
         */
        handBackOptions(){
            var tmpAry=[];
            let options=this.bpmTaskDetail.taskConfig.backOptions;
            for(var i=0;i<options.length;i++){
                let val=options[i];
                let option=this.backConfig.filter(item=>{
                    return val==item.value;
                })[0];
                tmpAry.push(option);
            }
            this.checkType=tmpAry[0].value;
            this.backs=tmpAry;
        },
        /**
         * 获取抄送用户。
         * @returns {string}
         */
        getCopyUserAccounts() {
            let accounts = [];
            if (this.copyUsers && this.copyUsers.length > 0) {
                this.copyUsers.forEach(item => {
                    accounts.push(item.id);
                })
            }
            return accounts.join(",");
        },
        //获取表单数据
        getFormJson() {
            var formDatas = this.bpmTaskDetail.formData ? this.bpmTaskDetail.formData.data : [];
            var rtn = {};
            for (var i = 0, j = formDatas.length; i < j; i++) {
                var formData = formDatas[i];
                var alias = formData.boAlias;
                rtn[alias] = formData.data;
            }
            return JSON.stringify(rtn);
        },
        handleCompleteCheck() {

            let self = this;
            if(!self.opinion){
                uni.showToast({
                    title:this.i18n('msg2','请输入意见'), // 消息内容
                    duration: 2000, // 持续时间（单位：毫秒）
                    icon: 'none' // 图标类型（可选值：success/loading/none）
                });
                return
            }
            //抄送用户
            let copyUserIds = this.getCopyUserAccounts();
            let formJson = this.getFormJson();

            let cmd = {
                taskId: this.taskId,
                checkType: this.checkType,
                nextJumpType: this.nextJumpType,
                opinion: this.opinion,
                copyUserAccounts: copyUserIds,
                formJson: formJson,
                opFiles: JSON.stringify(self.fileList)
            }
            if(this.checkType=='BACK_SPEC') {
                if(!this.destNodeId){
                    uni.showToast({
                        title: this.i18n('specifyNode','请指定节点'), // 消息内容
                        duration: 2000, // 持续时间（单位：毫秒）
                        icon: 'none' // 图标类型（可选值：success/loading/none）
                    });
                    return;
                }
                cmd.destNodeId = this.destNodeId;
            }
            BpmtaskApi.checkComplete(cmd).then(res => {
                if (res.success) {
                    uni.showToast({
                        title: self.i18n('rejectSuccess', '驳回成功'), // 消息内容
                        duration: 2000, // 持续时间（单位：毫秒）
                        icon: 'none' // 图标类型（可选值：success/loading/none）
                    });
                    this.clickNavLeft(3)
                } else {
                    uni.showToast({
                        title: res.message, // 消息内容
                        duration: 1500, // 持续时间（单位：毫秒）
                        icon: 'none' // 图标类型（可选值：success/loading/none）
                    });
                }
            })
        },
        onOk() {

        },
        closeWindow() {
            uni.navigateBack({
                delta: 1
            })
        },
    }
}
</script>

<style scoped>
.Transfer-center{
    background: white;
    border-radius: 5px;
    padding: 0.5rem;
}
.Transfer-textarea {
    font-size: 0.8rem;
    height: 124px;
    width: calc(100% - 1rem) !important;
    margin-top: 15px;
    border-radius: 8px;
    border: 1px solid rgba(232, 232, 232, 1);
    padding: 10px 10px 10px 10px;
}
.Transfer-number{
    border-radius: 8px;
    border: 1px solid rgba(232, 232, 232, 1);
    width: 4rem;
    padding: 0px 0.5rem;
    margin-top: 0.25rem;
    margin-right: 0.25rem;
}
.bpm-footer {
    display: flex;
    grid-gap: 10px;
}

.bpm-footer-close {
    flex: 1;
    height: 45px;
    opacity: 1;
    border-radius: 8px;
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(232, 232, 232, 1);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    color: rgba(0, 0, 0, 0.65);
}

.bpm-footer-ok {
    flex: 1;
    height: 45px;
    opacity: 1;
    border-radius: 8px;
    background: rgba(66, 133, 244, 1);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    color: white;
}
.bpm-REQUIRED::after{
    content:'*';
    color: red;
    position: absolute;
    left: 0.7rem;
}
</style>
